<template>
    <div>
        <div class="dialog__Einv--div">
            <group class="SendEmail__formPolicy--group">
                <cell class="SendEmail__Einv--title">
                    <span class="SendEmail__list--title" slot="after-title">
                        <span class="SendEmail__iconspan"></span>
                        <span class="SendEmail__iconspan--title">电子保单&nbsp</span>
                    </span>
                </cell>
                <div class="SendEmail__formPolicy">
                    <x-input v-model="queryData.emailStr" :max="60" placeholder="电子邮件  (收取电子保单)" is-type="email">
                        <div class="common__input " slot="label">
                            <img src="~assets/x3/ico/icon-email.png" class="icon-img">&nbsp&nbsp
                        </div>
                    </x-input>

                </div>
            </group>
            <div v-show="haveError" class="common_errorMsg">
                <badge text="!"></badge>
                <span>{{errorMessage}}</span>
            </div>
        </div>
        <x-button @click.native="sendEinvPrintData(2)" :style="loadStyle" mini type="primary">发送邮件</x-button>
        <x-button @click.native="close()" mini>取消</x-button>
    </div>
    </div>
</template>
<script>
import Validation from "src/common/util/validation";
import Config from 'src/common/config/orderConfig';
import DateUtil from 'src/common/util/dateUtil';
import { RequestUrl } from 'src/common/url';
import { XHeader, XTable, Cell, Group, Badge, ButtonTab, ButtonTabItem, Divider, Checker, XDialog, XButton, TransferDomDirective as TransferDom, XInput } from 'vux'
import { mapState, mapActions } from 'vuex';
import { Mutations, RouteUrl } from 'src/common/const';;
export default {
    components: {
        XInput,
        Group,
        XDialog,
        XButton,
        TransferDom,
        XHeader,
        Cell,
        Badge,
        ButtonTab,
        ButtonTabItem,
        Divider,
        XTable,
        Checker
    },
    computed: mapState([
        'order',
    ]),
    data() {
        return {
            //#636365
            loadStyle: "background:#C8161D;",
            // #C8161D
            isQuery: true,
            haveError: false,
            errorMessage: '',
            queryData: {
                TYPE: "FORM",
                policyNo: '',
                proposalDate: '',
                emailStr: '',
                applicantName: '',
            },
            seleOrder: {},
        }
    },
    filters: {
        dateFormat(value) {
            return DateUtil.getDateStr_YmdByTs(value);
        },
        orderState(index) {
            return Config.getOrderState(index);
        }
    },
    computed: mapState({
        order: "order"
    }),
    methods: {
        sendEinvPrintData(type) {
            if (this.isQuery) {
                let _this = this;
                $('.weui-input').focus();
                $('.weui-input').blur();
                // this.$common.storeCommit(this, Mutations.UPDATE_LOADING_STATUS, true);
                this.queryData.policyNo = this.order.downPolicyQueryData.policyNo;
                if (this.order.downPolicyQueryData.proposalDate != "") {
                    this.queryData.proposalDate = DateUtil.getDateStr_YmdByTs(this.order.downPolicyQueryData.proposalDate);
                }
                this.queryData.applicantName = this.order.downPolicyQueryData.applicantName;
                if (this.queryData.emailStr == "") {
                    return this.showErrorMsg("邮箱不能为空", false);
                }
                if (!Validation.isEmail(this.queryData.emailStr.toLowerCase())) {
                    return this.showErrorMsg("邮箱格式不正确", false);
                }
                this.isQuery = false;
                _this.$http.post(RequestUrl.DOWN_POLICY, this.queryData).then(function (res) {
                    _this.isQuery = true;
                    if (res.state == 0) {
                        _this.showErrorMsg("发送成功!请注意查收邮箱！", true);
                        _this.$common.storeCommit(_this, Mutations.ORDER_SET_EMAIL, false);
                    } else {
                        if (res.result == "") {
                            _this.showErrorMsg("发送失败，请稍后再试！", false);
                        } else {
                            _this.showErrorMsg(res.result, false);
                        }
                    }

                });


                // let url = RequestUrl.DOWN_POLICY + '?policyNo=' + this.queryData.policyNo + "&&proposalDate=" + this.queryData.proposalDate + "&&applicantName=" + this.queryData.applicantName + "&&emailStr=" + this.queryData.emailStr;

                // this.isQuery = false;

                // this.loadStyle = "background:#636365;";
                // if (this.queryData.emailStr == "") {
                //     return this.showErrorMsg("邮箱不能为空", false);
                // }
                // if (!Validation.isEmail(this.queryData.emailStr)) {
                //     return this.showErrorMsg("邮箱格式不正确", false);
                // }

                // let xhr = new XMLHttpRequest();
                // xhr.open('GET', url, true);    // 也可以使用POST方式，根据接口
                // xhr.responseType = "blob";  // 返回类型blob
                // // 定义请求完成的处理函数，请求前也可以增加加载框/禁用下载按钮逻辑
                // xhr.onload = function() {
                //     // 请求完成
                //     if (this.status === 200) {
                //         // 返回200
                //         let blob = this.response;
                //         if (this.response.type == "application/json") {
                //             // _this.haveError = true;
                //             // _this.errorMessage = "电子保单生成中,请稍后进行下载....";
                //             // _this.isQuery = true;
                //             // _this.isQuery = false;
                //             // _this.loadStyle = "background:#C8161D;";
                //             // _this.$common.storeCommit(_this, Mutations.UPDATE_LOADING_STATUS, false);
                //         } else {
                //             let reader = new FileReader();
                //             reader.readAsDataURL(blob);  // 转换为base64，可以直接放入a表情href
                //             reader.onload = function(e) {
                //                 // 转换完成，创建一个a标签用于下载
                //                 let a = document.createElement('a');
                //                 a.download = _this.queryData.policyNo + '.pdf';
                //                 a.href = e.target.result;
                //                 // $("body").append(a);  // 修复firefox中无法触发click
                //                 a.click();

                //                 // _this.$common.storeCommit(_this, Mutations.UPDATE_LOADING_STATUS, false);

                //                 // _this.errorMessage = "";
                //                 // let alert = "下载成功!";
                //                 // if (_this.queryData.emailStr != "") {
                //                 //     alert = "发送成功!";
                //                 // }
                //                 // _this.$vux.alert.show({ content: _this.$common.alertMsg(alert, "green;") });
                //                 setTimeout(() => {
                //                     _this.$vux.alert.hide();
                //                 }, 3000);
                //                 _this.$common.storeCommit(_this, Mutations.ORDER_SET_EMAIL, false);
                //                 // $(a).remove();
                //             }
                //         }
                //     }
                // };
                // // 发送ajax请求
                // xhr.send()
                // this.showErrorMsg("发送成功!请注意查收邮箱！", true);
                // this.$common.storeCommit(this, Mutations.ORDER_SET_EMAIL, false);
                // window.location.href = url;



            }



        },
        showErrorMsg(errorMsg, type) {
            this.$vux.alert.show({ content: this.$common.alertMsg(errorMsg, type ? "green;" : "red;") });
            setTimeout(() => {
                this.$vux.alert.hide();
            }, 3000);
            return false;
        },
        close() {
            this.$common.storeCommit(this, Mutations.ORDER_SET_EMAIL, false);
        },
        goBack() {
            this.$common.goBack(this);
        },
    },
    mounted() {
        let _this = this;
        this.queryData.policyNo = this.order.downPolicyQueryData;
        this.$init.subPageInit(this);
        $("body").css("overflow-y", "hidden");
    },
}
</script>


<style lang="scss">
.SendEmail__list--title {
  float: left;
  font-size: 15px;
  color: #C8161D;
  border-top: 1px solid #fff;
}

.SendEmail__iconspan {
  position: absolute;
  margin-top: 3px;
  width: 4px;
  height: 18px;
  background-color: #C8161D;
}

.SendEmail__iconspan--title {
  margin-left: 9px;
  font-size: 16px;
}

.SendEmail__Einv--title {
  border-top: 1px solid #fff;
  margin-left: -8px;
}

.SendEmail__formPolicy {
  border: 1px solid #e7e7e7;
  margin: 0 5px;
}

.SendEmail__formPolicy--group {
  padding: 0px 10px; // .vux-no-group-title {
  //     padding-bottom: 20px;
  // }
}

.dialog__Einv--div {
  margin-top: -7px;
}

.dialog__Einv--btn {
  float: right;
  margin-right: 13px;
}
</style>






